<template>
  <a-drawer width="550" placement="right" :closable="false" v-model:visible="visible" @close="onClose">
    <a-tabs>
      <a-tab-pane key="详情信息" tab="详情信息">
        <detailed-information :drawerdata="drawerdata" />
      </a-tab-pane>
      <a-tab-pane key="下载记录" tab="下载记录">
        <download-record :drawerdata="drawerdata" />
      </a-tab-pane>
      <a-tab-pane key="应用合并" tab="应用合并">
        <application-merge :drawerdata="drawerdata" />
      </a-tab-pane>
      <a-tab-pane key="下载码" tab="下载码">
        <download-code :drawerdata="drawerdata" /> 
      </a-tab-pane>
    </a-tabs>
  </a-drawer>
</template>

<script lang='ts'>
import { reactive, SetupContext, toRefs } from "vue";
import DetailedInformation from "./DrawerChildren/DetailedInformation.vue";
import DownloadRecord from "./DrawerChildren/DownloadRecord.vue";
import ApplicationMerge from "./DrawerChildren/ApplicationMerge.vue";
import DownloadCode from "./DrawerChildren/DownloadCode.vue";
export default {
  components: {
    DetailedInformation,
    DownloadRecord,
    ApplicationMerge,
    DownloadCode,
  },
  emits: ["onCloseDrawer"],
  props: {
    visible: Boolean,
    drawerdata: Object,
  },
  setup(props: any, ctx: SetupContext) {
    function onClose() {
      ctx.emit("onCloseDrawer", false);
    }
    return {
      onClose,
    };
  },
};
</script>
<style lang="less" scoped>
.ant-tabs {
  text-align: center;
}
</style>